@extends("layouts.backend.webadmin")
@section('content')
    <script type="text/javascript" src="{{env('APP_ROOT')}}/js/echarts.min.js"></script>
<!-- Main content -->
<!-- Content Header (Page header) -->

<!-- Main content -->
<style>
    .col-lg-3 .small-box {margin-bottom: 12px;}
    .col-lg-3 .small-box>.inner {padding: 5px 10px 0 10px;}
    .col-lg-3 .small-box>.inner>p {margin-bottom: 2px;}
    .col-lg-3 .small-box>.inner>h3 {margin-bottom: 5px;}
</style>
<section class="content">
        <div class="row">
            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-aqua">
                    <div class="inner">
                        <h3>
                            @if(in_array(0,$plucks))
                                @foreach($lists as $list)
                                    @if($list->type ==0) {{$list->count}} @endif
                                @endforeach
                            @else
                                0
                            @endif
                        </h3>
                        <p>待审核</p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-bag"></i>
                    </div>
                    <a href="{{route('admin.flaw.search',['id'=>0])}}" class="small-box-footer">更多 <i class="fa fa-arrow-circle-right"></i></a>
                </div>
            </div>
            <!-- ./col -->
            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-green">
                    <div class="inner">
                        <h3>
                            @if(in_array(1,$plucks))
                                @foreach($lists as $list)
                                    @if($list->type ==1) {{$list->count}} @endif
                                @endforeach
                            @else
                                0
                            @endif
                        </h3>

                        <p>已审核</p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-stats-bars"></i>
                    </div>
                    <a href="{{route('admin.flaw.search',['id'=>1])}}" class="small-box-footer">更多 <i class="fa fa-arrow-circle-right"></i></a>
                </div>
            </div>
            <!-- ./col -->
            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-yellow">
                    <div class="inner">
                        <h3>
                            @if(in_array(2,$plucks))
                                @foreach($lists as $list)
                                    @if($list->type ==2) {{$list->count}} @endif
                                @endforeach
                            @else
                                0
                            @endif
                        </h3>

                        <p>待确认</p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-person-add"></i>
                    </div>
                    <a href="{{route('admin.flaw.search',['id'=>2])}}" class="small-box-footer">更多 <i class="fa fa-arrow-circle-right"></i></a>
                </div>
            </div>
            <!-- ./col -->
            <div class="col-lg-3 col-xs-6">
                <!-- small box -->
                <div class="small-box bg-red">
                    <div class="inner">
                        <h3>
                        @if(in_array(3,$plucks))
                            @foreach($lists as $list)
                                    @if($list->type ==3) {{$list->count}} @endif
                            @endforeach
                        @else
                            0
                        @endif
                        </h3>

                        <p>待修复</p>
                    </div>
                    <div class="icon">
                        <i class="ion ion-pie-graph"></i>
                    </div>
                    <a href="{{route('admin.flaw.search',['id'=>3])}}" class="small-box-footer">更多 <i class="fa fa-arrow-circle-right"></i></a>
                </div>
            </div>
            <!-- ./col -->
        </div>
    <div class="row">
        <div class="col-lg-3 col-xs-6">
            <!-- small box -->
            <div class="small-box bg-teal">
                <div class="inner">
                    <h3>
                        @if(in_array(4,$plucks))
                            @foreach($lists as $list)
                                @if($list->type ==4) {{$list->count}} @endif
                            @endforeach
                        @else
                            0
                        @endif
                    </h3>
                    <p>已修复</p>
                </div>
                <div class="icon">
                    <i class="ion ion-bag"></i>
                </div>
                <a href="{{route('admin.flaw.search',['id'=>4])}}" class="small-box-footer">更多 <i class="fa fa-arrow-circle-right"></i></a>
            </div>
        </div>
        <!-- ./col -->
        <div class="col-lg-3 col-xs-6">
            <!-- small box -->
            <div class="small-box bg-olive">
                <div class="inner">
                    <h3>
                        @if(in_array(5,$plucks))
                            @foreach($lists as $list)
                                @if($list->type ==5) {{$list->count}} @endif
                            @endforeach
                        @else
                            0
                        @endif
                    </h3>

                    <p>已解决</p>
                </div>
                <div class="icon">
                    <i class="ion ion-stats-bars"></i>
                </div>
                <a href="{{route('admin.flaw.search',['id'=>5])}}" class="small-box-footer">更多 <i class="fa fa-arrow-circle-right"></i></a>
            </div>
        </div>
        <!-- ./col -->
        <div class="col-lg-3 col-xs-6">
            <!-- small box -->
            <div class="small-box bg-lime">
                <div class="inner">
                    <h3>
                        @if(in_array(6,$plucks))
                            @foreach($lists as $list)
                                @if($list->type ==6) {{$list->count}} @endif
                            @endforeach
                        @else
                            0
                        @endif
                    </h3>

                    <p>已关闭</p>
                </div>
                <div class="icon">
                    <i class="ion ion-person-add"></i>
                </div>
                <a href="{{route('admin.flaw.search',['id'=>6])}}" class="small-box-footer">更多 <i class="fa fa-arrow-circle-right"></i></a>
            </div>
        </div>
        <!-- ./col -->
        <div class="col-lg-3 col-xs-6">
            <!-- small box -->
            <div class="small-box bg-orange">
                <div class="inner">
                    <h3>
                        @if(in_array(7,$plucks))
                            @foreach($lists as $list)
                                @if($list->type ==7) {{$list->count}} @endif
                            @endforeach
                        @else
                            0
                        @endif
                    </h3>

                    <p>申诉中</p>
                </div>
                <div class="icon">
                    <i class="ion ion-pie-graph"></i>
                </div>
                <a href="{{route('admin.flaw.search',['id'=>7])}}" class="small-box-footer">更多 <i class="fa fa-arrow-circle-right"></i></a>
            </div>
        </div>
        <!-- ./col -->
    </div>
    <div class="row">
        <div class="col-lg-3 col-xs-6">
            <!-- small box -->
            <div class="small-box bg-fuchsia">
                <div class="inner">
                    <h3>
                        @if(in_array(8,$plucks))
                            @foreach($lists as $list)
                                @if($list->type ==8) {{$list->count}} @endif
                            @endforeach
                        @else
                            0
                        @endif
                    </h3>
                    <p>已忽略</p>
                </div>
                <div class="icon">
                    <i class="ion ion-bag"></i>
                </div>
                <a href="{{route('admin.flaw.search',['id'=>8])}}" class="small-box-footer">更多 <i class="fa fa-arrow-circle-right"></i></a>
            </div>
        </div>
        <!-- ./col -->
        <div class="col-lg-3 col-xs-6">
            <!-- small box -->
            <div class="small-box bg-purple">
                <div class="inner">
                    <h3>
                        @if(in_array(10,$plucks))
                            @foreach($lists as $list)
                                @if($list->type ==10) {{$list->count}} @endif
                            @endforeach
                        @else
                            0
                        @endif
                    </h3>

                    <p>已拒绝</p>
                </div>
                <div class="icon">
                    <i class="ion ion-stats-bars"></i>
                </div>
                <a href="{{route('admin.flaw.search',['id'=>10])}}" class="small-box-footer">更多 <i class="fa fa-arrow-circle-right"></i></a>
            </div>
        </div>
        <!-- ./col -->
        <div class="col-lg-3 col-xs-6">
            <!-- small box -->
            <div class="small-box bg-maroon">
                <div class="inner">
                    <h3>
                        @if(in_array(11,$plucks))
                            @foreach($lists as $list)
                                @if($list->type ==11) {{$list->count}} @endif
                            @endforeach
                        @else
                            0
                        @endif
                    </h3>

                    <p>无影响</p>
                </div>
                <div class="icon">
                    <i class="ion ion-person-add"></i>
                </div>
                <a href="{{route('admin.flaw.search',['id'=>11])}}" class="small-box-footer">更多 <i class="fa fa-arrow-circle-right"></i></a>
            </div>
        </div>
        <!-- ./col -->
        <!-- ./col -->
    </div>
        <!-- /.row -->
    <!-- /饼图开始 -->
    <div class="row">
        <!-- Left col -->
        <section class="col-lg-6 connectedSortable">
            <!-- Custom tabs (Charts with tabs)-->
            <div class="nav-tabs-custom">
                <!-- Tabs within a box -->
                <ul class="nav nav-tabs pull-right">
{{--                    <li class="active"><a href="#revenue-chart" data-toggle="tab">Area</a></li>
                    <li><a href="#sales-chart" data-toggle="tab">Donut</a></li>--}}
                    <li class="pull-left header"><i class="fa fa-pie-chart"></i> 饼图-状态统计</li>
                </ul>
                <div class="tab-content no-padding">
                    <!-- Morris chart - Sales -->
                    <div class="chart tab-pane active" id="revenue-chart" style="position: relative; height: 300px;"></div>
                    <div class="chart tab-pane" id="sales-chart" style="position: relative; height: 300px;"></div>
                </div>
                <input type="hidden" id="statusData" value="{{$jsonData}}">
            </div>
        </section>
        <section class="col-lg-6 connectedSortable">
            <!-- Custom tabs (Charts with tabs)-->
            <div class="nav-tabs-custom">
                <!-- Tabs within a box -->
                <ul class="nav nav-tabs pull-right">
                    {{--                    <li class="active"><a href="#revenue-chart" data-toggle="tab">Area</a></li>
                                        <li><a href="#sales-chart" data-toggle="tab">Donut</a></li>--}}
                    <li class="pull-left header"><i class="fa fa-pie-chart"></i> 饼图-等级统计</li>
                </ul>
                <div class="tab-content no-padding">
                    <!-- Morris chart - Sales -->
                    <div class="chart tab-pane active" id="level-chart" style="position: relative; height: 300px;"></div>
                    <div class="chart tab-pane" id="sales-chart" style="position: relative; height: 300px;"></div>
                </div>
                <input type="hidden" id="levelData" value="{{$levelData}}">
                <input type="hidden" id="levelNames" value="{{$levelNames}}">
            </div>
        </section>
    </div>
    <!-- /饼图结束 -->
</section>
<!-- /.content -->
<script type="text/javascript">
    $(function(){
       var statusData = $.parseJSON(document.getElementById('statusData').value),
           statusNames = ['待审核','已审核','待确认','待修复','已修复','已解决','已关闭','申诉中','已忽略','已拒绝','无影响'],
           statusColor = ['#00c0ef','#00a65a','#f39c12','#dd4b39','#39cccc','#3d9970','#01ff70','#ff851b','#f012be','#605ca8','#d81b60 ' ],
           levelColor = ['#D7504B','#B5C334','#FCCE10','#E87C25','#27727B','#FE8463','#9BCA63','#FAD860','#F3A43B','#60C0DD','#C1232B' ],
           levelData = $.parseJSON(document.getElementById('levelData').value),
           levelNames = $.parseJSON(document.getElementById('levelNames').value);
        setChart('level-chart',levelNames,levelData,'漏洞统计-等级',levelColor);
        setChart('revenue-chart',statusNames,statusData,'漏洞统计-状态',statusColor);
    });
    var setChart = function (eleId,typedata,showdata,text,VarColor){
        var myChart = echarts.init(document.getElementById(eleId));
        var option = {
            title : {
                text: text,
                subtext: '各状态占比',
                x:'center'
            },
            tooltip : {
                trigger: 'item',
                formatter: "{a} <br/>{b} : {c} ({d}%)"
            },
            legend: {
                orient: 'vertical',
                left: 'left',
                data: typedata
            },
            series : [
                {
                    name: '百分比',
                    type: 'pie',
                    radius : '55%',
                    center: ['50%', '60%'],
                    data:showdata,
                    itemStyle: {
                        emphasis: {
                            shadowBlur: 10,
                            shadowOffsetX: 0,
                            shadowColor: 'rgba(0, 0, 0, 0.5)'
                        },
                        normal: {
                            color: function(params) {
                                // build a color map as your need.
                                var colorList = VarColor;
                                return colorList[params.dataIndex]
                            }
                        }
                    }
                }
            ]
        };
        myChart.setOption(option);
    };
</script>
<!-- /.content-wrapper -->
@stop